export const AI_3D_DEMO_HTML_CODE = `
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>银河系及行星围绕太阳公转 3D 场景</title>
    <style>
        body {
            margin: 0;
            overflow: hidden;
        }

        #scene-container {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        #loading-message {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-family: Arial, sans-serif;
            font-size: 24px;
            color: white;
        }
    </style>
</head>

<body>
    <div id="scene-container"></div>
    <div id="loading-message">正在加载字体，请稍候...</div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
    <script>
        // 定义行星数据（距离、大小、公转速度、自转速度、名称、颜色）
        const planetsData = [
            { distance: 3, size: 0.2, speed: 0.02, rotationSpeed: 0.005, name: '水星', color: 0x888888 },
            { distance: 4, size: 0.3, speed: 0.015, rotationSpeed: 0.003, name: '金星', color: 0xffcc00 },
            { distance: 5, size: 0.35, speed: 0.01, rotationSpeed: 0.002, name: '地球', color: 0x00ff00 },
            { distance: 6, size: 0.3, speed: 0.008, rotationSpeed: 0.004, name: '火星', color: 0xff0000 },
            { distance: 8, size: 1, speed: 0.005, rotationSpeed: 0.001, name: '木星', color: 0xffaa00 },
            { distance: 10, size: 0.9, speed: 0.003, rotationSpeed: 0.0015, name: '土星', color: 0xffdd88 },
            { distance: 12, size: 0.7, speed: 0.002, rotationSpeed: 0.0008, name: '天王星', color: 0x00ffff },
            { distance: 14, size: 0.7, speed: 0.001, rotationSpeed: 0.0006, name: '海王星', color: 0x0000ff }
        ];

        const loader = new THREE.FontLoader();
        loader.load('https://plain-assets.oss-cn-guangzhou.aliyuncs.com/FZYaoTi_Regular.json', function (font) {
            // 字体加载完成，移除加载提示
            const loadingMessage = document.getElementById('loading-message');
            loadingMessage.style.display = 'none';

            // 创建场景
            const scene = new THREE.Scene();

            // 创建相机，设置 45 度俯视角
            const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
            camera.position.set(0, 20 * Math.sin(Math.PI / 4), 20 * Math.cos(Math.PI / 4));
            camera.lookAt(scene.position);

            // 创建渲染器
            const renderer = new THREE.WebGLRenderer();
            renderer.setSize(window.innerWidth, window.innerHeight);
            document.getElementById('scene-container').appendChild(renderer.domElement);

            // 创建银河系
            const starGeometry = new THREE.BufferGeometry();
            const starMaterial = new THREE.PointsMaterial({ color: 0xffffff, size: 0.01 });
            const starPositions = [];
            for (let i = 0; i < 10000; i++) {
                const x = (Math.random() - 0.5) * 200;
                const y = (Math.random() - 0.5) * 200;
                const z = (Math.random() - 0.5) * 200;
                starPositions.push(x, y, z);
            }
            starGeometry.setAttribute('position', new THREE.Float32BufferAttribute(starPositions, 3));
            const stars = new THREE.Points(starGeometry, starMaterial);
            scene.add(stars);

            // 创建太阳
            const sunGeometry = new THREE.SphereGeometry(2, 32, 32);
            const sunMaterial = new THREE.MeshBasicMaterial({ color: 0xffff00 });
            const sun = new THREE.Mesh(sunGeometry, sunMaterial);
            scene.add(sun);

            // 为太阳添加名称
            const sunTextGeometry = new THREE.TextGeometry('太阳', {
                font: font,
                size: 0.8,
                height: 0.01
            });
            const sunTextMaterial = new THREE.MeshBasicMaterial({ color: 0xffffff });
            const sunTextMesh = new THREE.Mesh(sunTextGeometry, sunTextMaterial);
            sunTextMesh.position.set(0, 2.5, 0);
            scene.add(sunTextMesh);

            const planets = [];
            const planetOrbits = [];
            const textGeometries = [];

            planetsData.forEach((data, index) => {
                const planetGeometry = new THREE.SphereGeometry(data.size, 32, 32);
                const planetMaterial = new THREE.MeshBasicMaterial({ color: data.color });
                const planet = new THREE.Mesh(planetGeometry, planetMaterial);
                const planetOrbit = new THREE.Object3D();
                planetOrbit.add(planet);
                planet.position.x = data.distance;
                scene.add(planetOrbit);
                planets.push(planet);
                planetOrbits.push(planetOrbit);

                const textGeometry = new THREE.TextGeometry(data.name, {
                    font: font,
                    size: data.size * 0.8,
                    height: 0.01
                });
                const textMesh = new THREE.Mesh(textGeometry, sunTextMaterial);
                textMesh.position.copy(planet.position);
                textMesh.position.y += data.size * 1.2;
                planetOrbit.add(textMesh);
                textGeometries.push(textMesh);
            });

            // 渲染循环
            function animate() {
                requestAnimationFrame(animate);

                planetOrbits.forEach((orbit, index) => {
                    orbit.rotation.y += planetsData[index].speed;
                });

                planets.forEach((planet, index) => {
                    planet.rotation.y += planetsData[index].rotationSpeed;
                });

                renderer.render(scene, camera);
            }
            animate();
        }, undefined, function (error) {
            console.error('字体加载失败:', error);
            const loadingMessage = document.getElementById('loading-message');
            loadingMessage.textContent = '字体加载失败，请刷新页面重试。';
        });
    </script>
</body>

</html>
`.trim();
